<template>
  <div class="login">
    <group class="inputs">
      <x-input 
      placeholder="请输入员工号" 
      :show-clear="false"
      v-model="username"
      placeholder-align="left"></x-input>
    <x-input 
      placeholder="请输入密码" 
      type="password"
      :show-clear="false"
      v-model="password"
      placeholder-align="left"></x-input>
    </group>
    <div style="padding:10px 0 0 10px">
      <check-icon :value.sync="isSave"> 记住密码 </check-icon>
    </div>
    <x-button 
    class="btn"
    @click.native="submit" 
    type="primary">登录</x-button>
  </div>
</template>

<script>
import { XInput, Group, XButton,CheckIcon } from "vux";
import axios from "axios";
import { setTimeout } from "timers";
export default {
  name: "login",
  components: {
    XInput,
    Group,
    XButton,
    CheckIcon
  },
  data() {
    return {
      username: "",
      password: "",
      isSave:false
    };
  },
  created(){
    if(window.localStorage.getItem('userInfo')){
        let userInfo = JSON.parse(window.localStorage.getItem('userInfo'));
        if(userInfo&&userInfo.isSave){
          this.username = userInfo.username;
          this.password = userInfo.password;
          this.isSave = userInfo.isSave;
        }
    }
    
  },
  methods: {
    submit() {
      if (this.username == "" || this.password == "") {
        this.$vux.toast.text("用户名和密码不能为空");
        return;
      }
      this.$http
        .post("/mall/v1/login", {
          jobNum: this.username,
          password: this.password,
          openId:this.$store.state.common.openid
        })
        .then(data => {
          if(this.isSave){
            window.localStorage.setItem('userInfo',JSON.stringify({
              username:this.username,
              password:this.password,
              isSave:this.isSave
            }))
          }else{
            window.localStorage.setItem('userInfo','null')
          }
          this.$router.push({ path: "/home", replace: true });
        })
        .catch(e => {
          e&&this.$vux.toast.text(e);
        });
    }
  }
};
</script>

<style scoped lang="less">
@import "./index.less";
</style>
